<%--
  Created by IntelliJ IDEA.
  User: xianfei
  Date: 15-3-18
  Time: 上午11:14
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>抽奖环节</title>
    <style>
        .luck li {
            width: 100px;
            height: 30px;
            line-height: 30px;
            list-style: none;
            float: left;
            margin-right: 70px;
            font-size: 15px
        }

        .luck li:hover {
            background-color: #00E8D7;
            border: 1px solid red;
        }

        .currentLuck {
            background-color: #00E8D7;
        }
    </style>
    <script>
        $(function () {
            $(".awards").bind("click", function () {
                $(".awards").removeClass("currentLuck");
                $(this).addClass("currentLuck");
            });
            $("#start").click(function () {
                var prize = $(".currentLuck").html();
                var prizeName = $(".prizeName");
                var count = 0;
                if ("一等奖" == prize) {
//                    for (var i = 0; i < prizeName.length; i++) {
//                        if (prizeName.eq(i).html() == "一等奖") {
//                            count = count + 1;
//                        }
//                    }
//                    if (count >= 1) {
//                        alert("一等奖名额已经完毕，不能再抽奖了!");
//                        return false;
//                    }
                } else if ("二等奖" == prize) {
//                    for (var i = 0; i < prizeName.length; i++) {
//                        if (prizeName.eq(i).html() == "二等奖") {
//                            count = count + 1;
//                        }
//                    }
//                    if (count >= 3) {
//                        alert("二等奖名额已经完毕，不能再抽奖了!");
//                        return false;
//                    }
                } else if ("三等奖" == prize) {
//                    for (var i = 0; i < prizeName.length; i++) {
//                        if (prizeName.eq(i).html() == "三等奖") {
//                            count = count + 1;
//                        }
//                    }
//                    if (count >= 5) {
//                        alert("三等奖名额已经完毕，不能再抽奖了!");
//                        return false;
//                    }
                } else if ("参与奖" == prize) {
//                    for (var i = 0; i < prizeName.length; i++) {
//                        if (prizeName.eq(i).html() == "参与奖") {
//                            count = count + 1;
//                        }
//                    }
//                    if (count >= 10) {
//                        alert("参与奖名额已经完毕，不能再抽奖了!");
//                        return false;
//                    }
                } else {
                    alert("请选择奖项!");
                    return false;
                }
                $.ajax({
                    url: '/luck/start/' + prize,
                    type: 'GET',
                    dataType: 'text',
                    success: function (data) {
                        if (data == "error") {
                            alert('用户已抽取完毕!');
                        } else if (data == "fail") {
                            alert("该奖项名额已抽取完毕！");
                        } else {
                            var array = data.split("&");
                            var prize = $(".currentLuck").html();
                            var content = '<tr class="tr"><td class="name">' + array[0] + '</td><td class="phone">' + array[1] + '</td><td class="prizeName">' + prize + '</td></tr>';
                            if ($(".tr").length < 1) {
                                $("tbody").html(content);
                            } else {
                                $(".tr:last").after(content);
                            }
                        }
                    },
                    error: function () {
                        alert("error");
                    }
                })

            });
        });
        function send() {
            var trs = $(".tr");
            var content = "";
            var str = "";
            if (trs.length < 1) {
                alert("没有中奖用户!");
                return false;
            }
            for (var i = 0; i < trs.length; i++) {
                var name = $(".name").eq(i).html();
                var phoneNum = $(".phone").eq(i).html();
                var prizeName = $(".prizeName").eq(i).html();
                str = name + "^" + phoneNum + "^" + prizeName;
                content += str + "&";
            }
            $.ajax({
                url: '/luck/sendMsg/' + content,
                dataType: 'text',
                type: 'GET',
                success: function (data) {
                    alert(data);
                },
                error: function () {
                    alert("error");
                }
            });

        }

    </script>
</head>
<body>
<div style="width:200px;height:40px;margin-left:600px;">
    <input type="button" value="抽奖" class="btn btn-primary" id="start">&nbsp;
    <input type="button" value="发送短信" class="btn btn-info" onclick="send()">
</div>
<div style="width:700px;margin:20px 350px 0px 350px;border:0px solid red;float:left" class="luck">
    <ul>
        <li class="awards">一等奖</li>
        <li class="awards">二等奖</li>
        <li class="awards">三等奖</li>
        <li class="awards">参与奖</li>
    </ul>
</div>
<div style="width:600px;margin:20px 350px 0px 350px;border:0px solid red">
    中奖用户:
    <table class="table table-hover">
        <thead>
        <th>名称：</th>
        <th>手机号：</th>
        <th>奖项：</th>
        </thead>
        <tbody>

        </tbody>
    </table>
</div>
</body>
</html>